import React from 'react';
import { inject, observer } from 'mobx-react';
import { Spin, Modal } from 'antd';
const confirm = Modal.confirm;
import {toJS} from "mobx";
import {WeaTableNew} from 'comsMobx';
const WeaTable = WeaTableNew.WeaTable;
import {WeaRightMenu, WeaTop, WeaTab, WeaErrorPage, WeaTools, WeaAlertPage} from 'ecCom';
import {WeaLocaleProvider} from 'ecCom';
import {Condition,getAdButtons} from '../list/listCondition';
import {Text} from '../util/text';
const text = new Text();
const getLabel = WeaLocaleProvider.getLabel;

@inject('searchStore')
@observer
class SearchResult extends React.Component {
    constructor(props) {
        super(props);
    }
    componentWillMount() {
        const { location: {query}, searchStore } = this.props;
        if (!query.from) {
            searchStore.initDatas();
        }
        searchStore.doSearch();
    }
    componentWillUnmount() {
        const { searchStore } = this.props;
        searchStore.clearStatus();
    }

    render() {
        const {searchStore} = this.props;
        const {loadingSpin, isRight,status: {loading}, tableStore, form, condition,showSearchAd,reLoad} = searchStore;
        if (loadingSpin) {
            return <div className="h100" style={{ textAlign: 'center', paddingTop: '300px' }}><Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@wj8fd0`} size="large"/></div>
        }
        if (!isRight) {
            return <WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@vuatu1`}><div>{getLabel(382663, '暂无权限') }</div></WeaAlertPage>
        }
        const formParams = form.getFormParams() || {};
        return (
            <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@e3v48n`} datas={this.getRightMenu() }  >
                <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@alsjgk`}
                    title={text.SEARCHRESULT }
                    loading={loading}
                    icon={<i className='icon-coms-government' />}
                    iconBgcolor='#f14a2d'
                    showDropIcon={true}
                    dropMenuDatas={this.getRightMenu() }
                    >
                    <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@bezyuu`}
                        buttonsAd={getAdButtons(searchStore) }
                        searchType={['base', 'advanced']}
                        searchsBaseValue={formParams.title}
                        setShowSearchAd={bool => { searchStore.setShowSearchAd(bool) } }
                        hideSearchAd={() => searchStore.setShowSearchAd(false) }
                        searchsAd={
                            <div><Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@5i81o8`} listStore={searchStore} form={form} condition={condition} onEnterSearch={()=>{searchStore.doSearch();searchStore.setShowSearchAd(false);}}></Condition></div>
                        }
                        showSearchAd={showSearchAd}
                        onSearch={v => { searchStore.doSearch() } }
                        onSearchChange={v => {
                            if (searchStore.form.has("title")) {
                                searchStore.appendFormFields({ title: { value: v } })
                            } else {
                                searchStore.form.add(v, { key: "title" })
                            }
                        } }
                        />
                    <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@nzquxh`}
                        className="wea-info-table"
                        comsWeaTableStore={tableStore}
                        hasOrder={true}
                        needScroll={true}
                        register_table={() => reLoad() }
                        />
                </WeaTop>
            </WeaRightMenu>)

    }

    getRightMenu() {
        const {searchStore } = this.props;
        let btns = [];
        btns.push({
            key: "search",
            icon: <i className='icon-coms-search'/>,
            content: text.SEARCH,
            onClick: () => this.onRightMenuClick('BTN_SEARCH')
        });
        return btns;
    }

    onRightMenuClick = (type) => {
        const { searchStore } = this.props;
        if (type == 'BTN_SEARCH') {
            searchStore.doSearch();
        }
    }
}

export default WeaTools.tryCatch(React,
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@nggjem`} msg={ props.error ? props.error : getLabel(383324, '对不起，该页面异常，请联系管理员') } />,
    { error: "" }
)(SearchResult);